<template>
  <div class="activity">
    <x-header :left-options="{backText: ''}">活动中心</x-header>
    <div>
      <div style="height: 10px;background: #f6f6f6;"></div>
      <ul style="padding:10px;">
        <li v-for="activity in activityList" @click="jump(activity.id)">
          <img :src="activity.url[0]" alt="" class="imgSty">
          <div style="margin-top:5px">
            <span class="c6">{{activity.title}}</span>
            <span class="c9">{{activity.date}}</span>
          </div>
        </li>
      </ul>
    </div>
  </div>
</template>
<script>
  import { XHeader } from 'vux'
  import http from '../../service/http.js'
  import util from '../../service/util.js'
  import tips from '../../service/tips.js'
  export default {
    data() {
      return {
        activityList: [],
      }
    },
    mounted() {
      this.getActivity();
    },
    methods: {
      getActivity() {
        http.get("/user/activitys").then((res) => {
          if (res.status == 200) {
            this.activityList = res.data.body;
          }
        })
      },
      jump(id) {
        if (id == 'bncn') {
          if (!util.getItem('login.username')) {
            tips.tips("您未登录");
            return false;
          }
          this.$router.push({ path: "/main/receive" })
        }
        if (id == "packet") {
          if (!util.getItem('login.username')) {
            tips.tips("您未登录");
            return false;
          }
          this.$router.push({ path: "/main/newcomer" })
        }
      }
    },
    components: {
      XHeader,
    }
  }
</script>
<style lang="less">
  .activity .vux-header {
    background: #fff;
  }

  body {
    background: #fff;
  }

  .c6 {
    color: #666;
  }

  .c9 {
    color: #999;
  }

  .activity .vux-header .vux-header-left .left-arrow:before {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    border: 1px solid #000;
    border-width: 1px 0 0 1px;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
    top: 8px;
    left: 7px;
  }

  .activity .imgSty {
    display: block;
    /* height: 137px; */
    width: 100%;
  }

  .activity .vux-header .vux-header-title {
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    color: #000;
  }

  .activityList {
    height: 160px;
    line-height: 40px;
    padding: 0px 15px;
    position: relative;
  }
</style>